
function CreateToolbar()
{

    var htm=[], tb=Toolbar(PIC_ROOT);
  
    tb.store ('back', '/webservices/images/backbutton.png');
    tb.store ('restore', '/webservices/images/explorer/alerticon.jpg');
/*
    tb.store ('new', '/webservices/images/explorer/new.gif');
    tb.store ('query', '/webservices/images/edit.gif');
    tb.store ('table', '/webservices/images/ico_grid.jpg');
    tb.store ('db', '/webservices/images/s_db.png');
    tb.store ('sql', '/webservices/images/xui.view.gif');
    tb.store ('output', '/webservices/images/view.gif');
    tb.store ('grid', '/webservices/images/table.gif');
    tb.store ('text', '/webservices/images/explorer/NOTE08.ICO.gif');
    tb.store ('exclaim', '/webservices/images/explorer/alerticon.jpg');
    tb.store ('build', '/webservices/images/xui.graph.gif');
    tb.store ('open', '/webservices/images/explorer/icon_book.gif');
    tb.store ('addcolumn', '/webservices/images/icon_addtoplaylist.gif');
    tb.store ('rename', '/webservices/images/explorer/input_icon.gif');
    tb.store ('remove', '/webservices/images/delete.gif');
    tb.store ('scalar', '/webservices/images/pda/pda_card.gif');
    tb.store ('spacer', '/webservices/images/clear.gif');
    tb.store ('options', '/webservices/images/i.p.folder.drafts.gif');
*/
    
    tb.add ('back', 'Controller.HomePage.invoke();', 'back'); 
    tb.add ('restore', 'RestoreImage();', 'restore'); 
    htm.push ( tb.draw() ) ; 
    return htm.join ('');
}


function CreateWorkspace()
{
    Controller.pictures = webservice.GetPictures();
    var htm=[''],pic=Controller.pictures;
    var row = '<tr>' +
              '  <td><a href="javascript:void(0)" onclick="DeletePicture(\'(2)\')">(x)</a></td>' +
              '  <td align="center"><img src="(0)" height="40"></td>' +
              '  <td><a href="javascript:void(0)" onclick="OpenPicture(\'(2)\')">(1)</a><br>Size: (3)</td>' +
              '</tr>';
    if (Controller.picture)
    {
        htm.push ('<img src="(0)" height="240"><br>(1)'.format(Controller.picture.url, Controller.picture.name));
    }
    htm.push ('<h2>Pictures on File</h2>');
    htm.push ('<div id="imagelist" style="overflow:auto">');
    htm.push ('<table>');
    for (var e=0;e<pic.length;e++)
        htm.push (row.format(pic[e].url,pic[e].name,pic[e].id,pic[e].size));
    htm.push ('</table>');
    htm.push ('</div>');
    return htm.join ('');
}


function CreateSidebar()
{
    var htm=[], f=function(i) { return PanelEngine.UI[i].state&Panel.states.EXPANDED?'sidebarminus':'sidebarplus' };
    var anc='<div class="sidebarhdr (1)"><a href="javascript:void( 0 )" onclick="PanelEngine.Restate( \'(2)\', (3) )">(0)</a></div>';
    var tool = Controller.tool && Tools[Controller.tool] ? Tools[Controller.tool] : null;

    htm.push ('<div id="mysidebar" style="height:100px;overflow:auto;">');

    var DrawPanel = function(name)
    {
        
            var panel = PanelEngine.UI[ name ];
            if (panel.state & Panel.states.DOCKED)
            {
                htm.push (anc.format(panel.caption, f(name), name, Panel.states.EXPANDED));
                if (panel.state & Panel.states.EXPANDED)
                { 
                    if (panel.create)
                        htm.push (panel.create());
                }
            }
    }

    for (var name in PanelEngine.UI) 
        if ( PanelEngine.UI[name].state & Panel.states.DEFAULT)
            DrawPanel (name)   

    if (tool && tool.panel)
        for (var i=0;i<tool.panel.length;i++)
            DrawPanel (tool.panel[i])  

    for (var name in PanelEngine.UI) 
        if ( !(PanelEngine.UI[name].state & Panel.states.SPECIAL))
            DrawPanel (name)   
 
    htm.push ('</div>');
    return htm.join ('');
}


function CreateLogWindow ()
{
    
    var htm=[];
    htm.push ('<div id="dlog">');   
    htm.push ('loading...');   
    htm.push ('<div>');
    return htm.join ('');
}

function CreateColorTable ()
{
   var pat='<td bgcolor="#(0)" valign="bottom"><img width="24" height="12" onclick="SetColor(\'(0)\')" src="/pimp/images/(1).gif"></td>';
   var htm=[];
   var clr='00336699CCFF',sel=Controller.color,arr=[sel.substr(0,2), sel.substr(2,2), sel.substr(4,2)];
   htm.push ('<table cellpadding="0" cellspacing="0" align="center">');
   for (var rgb=0;rgb<3;rgb++)
   {
       htm.push ('<tr>');
       for (var x=0;x<clr.length;x+=2)
       {
           //var r = clr.substr(x,2);
           var hue = [sel.substr(0,2), sel.substr(2,2), sel.substr(4,2)]
           hue[rgb] = clr.substr(x,2);
           var my = hue.join('');
           htm.push (pat.format(my, my==sel?'arrow':'line'));
       }
       htm.push ('</tr>');
   }
   htm.push ('</table>');
   htm.push (Controller.color);
    return htm.join ('');
}

function CreateImageMap ()
{
    var htm=[], sp=[50,60,70,80,100];
    htm.push ('<map name="green">');

        for (var e=1,x=0;e<=16;e*=2)
        {
            x += 30;
            htm.push ('<area shape="rect" coords="(0),(1),(2),(3)" href="javascript:SetBrush( (4) )">'.format(x-15,0,x+15,45,e)); 
        }
        for (var e=0,x=0;e<sp.length;e++)
        {
            x += 30;
            htm.push ('<area shape="rect" coords="(0),(1),(2),(3)" href="javascript:SetBrush( (4) )">'.format(x-15,45,x+15,90,sp[e])); 
        }

    htm.push ('');
    htm.push ('</map>');
    return htm.join ('');


}

function CreateAddForm ()
{
    var htm=[];
    htm.push ('<form method="post"');  
	htm.push (' action="#"');  
	htm.push (' onSubmit="return AIM.submit(this, {\'onStart\' : startCallback, \'onComplete\' : completeCallback})"');  
	htm.push (' enctype="multipart/form-data">');
	 
	htm.push ('<strong>Upload an Image:</strong>:'); 
	htm.push ('File:'); 
	htm.push ('<input size=40 name=fileUpload type=file><input type=submit value="Upload Image">');  
	  
	  
	htm.push ('</form>');
	htm.push ('');
	//htm.push ('<b>Types of files that you can upload:</b>');  
	//htm.push ('<ul>');  
	//htm.push ('<li>Plain text (.txt) and HTML (*.htm,*.html) documents <b>up to 500KB</b>');  
	//htm.push ('</ul>');  
    return htm.join ('');
}

function CreateImageWindow ()
{
    var pattern = '<div id="imagewindow" class="imagewindow">' + 
                  '<img onload="AttachActualWindow()"' + 
                  ' src="/webservices/images/clear.gif"' + 
                  ' id="imageactual">' + 
                  '<div id="dmarquee" style="position:absolute"></div>' + 
                  '</div>';
    return pattern; 
}

function CreateThumbnailWindow()
{
    var hide = Controller.sstate&8 ? '' : 'none'; 
    var throbber='/webservices/images/clear.gif',htm=[],mnu=[];
    htm.push ('<div style="width:200px;display:(0)" align="center" class="imagewindow">'.format(hide));
    htm.push ('<img src="(0)" id="impreview" onload="AttachPreviewWindow()" >'.format(throbber));
    htm.push ('</div>');
    htm.push ('<div style="font-size:7pt;display:(0)">'.format(hide)); 
    mnu.push ('<input size=2 value="(0)" id="izoom" onchange="ResetImageSize(this.value/100)">%');
    for (var x=.25;x<=16;x+=x<2?(x<1?.25:1):x)
        mnu.push ('<a href="javascript:void( 0 )" onclick="ResetImageSize( (0) )">(0)x</a>'.format(x,x*100));
    htm.push (mnu.join('-'))
    htm.push ('</div>');
    htm.push ('<div id="dnavbox" style="border:solid 2px red;position:absolute;display:(0)" align="center">'.format(hide));
    htm.push ('<img src="(0)" id="inavbox">'.format(throbber));
    htm.push ('</div>');
    return htm.join ('');
}

function CreateBlankView () { return ''; }
function CreateWaitView () { return 'Please wait while the operation completes...'; }